<template>
  <div class="home">
    <van-search
      v-model="value"
      shape="round"
      disabled
      @click="$router.push('/home/search')"
      placeholder="请输入搜索关键词"
    />
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="item in banner" :key="item.id">
        <img :src="item.image_url" alt="" />
      </van-swipe-item>
    </van-swipe>
    <transition name="van-slide-right">
      <router-view></router-view>
    </transition>
    <!-- 产品组件 -->
    <Goods
    :channel='channel'
    :brandList='brandList'
    :newGoodsList='newGoodsList'
    :hotGoodsList='hotGoodsList'
    :topicList='topicList'
    :categoryList='categoryList'
    :goodsList='goodsList'
    />
    
  </div>
</template>

<script>
// @ is an alias to /src
import { GetHomeLists, GetGoodsList, GetBrandDetail } from "@/request/api";
import Goods from "@/views/Goods";
export default {
  name: "Home",
  data() {
    return {
      value: "",
      banner: [],
      channel: "",
      brandList: "",
      newGoodsList: "",
      topicList:'',
      hotGoodsList:'',
      categoryList:'',
      goodsList:''
    };
  },
  components: {
    Goods,
  },
  created() {
    GetHomeLists().then((res) => {
      // console.log(res);
      this.banner = res.data.banner;
      this.channel = res.data.channel;
      this.brandList = res.data.brandList;
      this.newGoodsList = res.data.newGoodsList;
      this.hotGoodsList = res.data.hotGoodsList;
      this.topicList=res.data.topicList;
      this.categoryList=res.data.categoryList
     /*  this.goodsList=this.categoryList.goodsList  
      console.log(this.goodsList); */
    });
    /*  GetBrandDetail().then((res) => {
      console.log(res);
    }); */
  },
 
};
</script>
<style lang="less">
.van-swipe-item{
  width: 100%;
}
.van-swipe-item img {
  width: 100%;
  display: block;
}
</style>
